<template>
  <Spin :spinning="props.loading">
    <Form :model="props.formState" layout="inline" class="bg-white pt-4 pb-4 mb-4 pl-2 rounded">
      <slot></slot>
      <FormItem>
        <Button @click="onReset" class="mr-2" >重置</Button>
        <Button type="primary" @click="onSearch" >搜索</Button>
      </FormItem>
    </Form>
  </Spin>
</template>

<script setup lang="ts">
import {} from 'vue'
import { Form, FormItem, Button, Spin } from 'ant-design-vue'

const emits = defineEmits<{
  (e: 'search'): void
}>()

const props = defineProps<{
  formState: any,
  loading?: boolean
}>()

const { resetFields } = Form.useForm(props.formState)

function onReset() {
  resetFields();
}

function onSearch() {
  emits('search')
}

</script>